/**
 * 母婴知识
 * Created by yangjingjing on 2017/8/1.
 */
import React, { Component } from "react"
import  { Link } from 'react-router'
import fetchData from '../../util/fetch'
import { Tabs, Carousel, Row, Col, Modal, Input, Button, Form, message, DatePicker,Pagination } from 'antd'
const TabPane = Tabs.TabPane;
import { getUrl } from '../../util/function'
import moment from 'moment'
const FormItem = Form.Item;

class MomAndBabyKnowledge extends Component {
    constructor(props) {
        super(props)
        this.state = {
            banner: null,
            momAndBabyKnowledge: null,//母婴知识
            momAndBabyKnowledgeList: null,//母婴知识列表
            total:0,
            size : 3,
            current:1
        }
    }

    getData(url, opts) {
        fetchData(url, opts, function (res) {
            let data = eval(res.data)
            switch (opts.str) {
                case '4-3':
                    this.setState({
                        momAndBabyKnowledge: data
                    });
                    break;
                case '4-3-1':
                    console.log("母婴知识列表", data,res.total,res.page,res.size);
                    this.setState({
                        momAndBabyKnowledgeList: data,
                        total : res.total,
                        size : res.size,
                        current:res.page
                    });
                    break;
            }
        }.bind(this))
    }

    getBannerData(url, opts) {
        fetchData(url, opts, function (res) {
            let data = eval(res.data);
            this.setState({
                banner: data
            });
        }.bind(this));
    }

    componentDidMount() {
        //banner类型 1首页、2hibaby服务、3美研中心、4活动咨询、5新妈分享、6关于Hibaby
        this.getBannerData('/crm/api/v1/web/banner/findOneByType', { "dataId": 4 });
        // 4-2	活动招募
        this.getData('/crm/api/v1/web/news/findOneByType', { "str": "4-3" });
        // 4-2-1	活动招募列表
        this.getData('/crm/api/v1/web/news/findPageListByType', {
            "page": 1,
            "size": this.state.size,
            "str": "4-3-1",
            "type": "4-3-1"
        });


    }

    onChange = (page) => {
        this.getData('/crm/api/v1/web/news/findPageListByType', {
            "page": page,
            "size": this.state.size,
            "type": "4-3-1",
            "str": "4-3-1"
        });
    }


    initActivityContent(){
        const {momAndBabyKnowledge,momAndBabyKnowledgeList} = this.state;
        return (
            <div className="activity-content">
                <Row className="activity-content-top">
                    <Col span={12}><h1>{this.state.momAndBabyKnowledge ? this.state.momAndBabyKnowledge.title : '母婴知识 Knowledge'}</h1></Col>
                    <Col span={12}><p>当前位置：<Link to="/service">首页</Link>&gt;<Link to="/activity/1">活动咨询</Link>&gt;<Link to="/activity/3">母婴知识</Link>&gt;列表</p></Col>
                </Row>
                {
                    momAndBabyKnowledgeList?momAndBabyKnowledgeList.map(function (item,index) {
                        return (
                            <Row className="activity-content-row">
                                <Col className="activity-content-col" span={5}><Link to={`/detail?id=${item.id}`}><img src={item.img1Url} /></Link></Col>
                                <Col className="activity-content-col" span={19}>
                                    <Link to={`/detail?id=${item.id}`}>
                                        <h3>{item.title}</h3>
                                        <p>{item.summary}</p>
                                    </Link>
                                </Col>
                            </Row>
                        )
                    }):null
                }
                {
                    this.state.total > 0 ?
                        <Pagination size="small"
                           current={this.state.current}
                           pageSize={this.state.size}
                           total={this.state.total}
                           onChange={this.onChange.bind(this)}/>:null
                }

            </div>
        );
    }

    render() {
        return (
            <div className="activityListPage">
                <div className="activity-banner"><img src={this.state.banner ? this.state.banner.imgUrl : ''}/></div>
                {this.initActivityContent()}
            </div>
        )
    }
}

export default  Form.create()(MomAndBabyKnowledge) ;
